<template>
  <user-login-info></user-login-info>
  <swiper
    :indicator-dots="true"
    :autoplay="true"
    :interval="3000"
    :duration="500"
  >
    <swiper-item
      v-for="(item, index) in adsenseData"
      :key="index"
      @click="handleAdClick(item.url)"
    >
      <view class="swiper-item">
        <van-image
          width="700rpx"
          height="150rpx"
          :src="item.src"
          radius="5px"
        />
      </view>
    </swiper-item>
  </swiper>
  <view between class="p-3 bg-white rounded-sm">
    <text class="text-base">历史记录</text>
    <van-icon name="arrow" />
  </view>
  <icon-components :icon-list="iconList"></icon-components>
</template>

<script setup lang="ts">
import { onMounted, ref } from 'vue'
import { getAdsenseData } from '@/api/adsense'

import IconComponents from '@/layout/components/IconComponents.vue'
import UserLoginInfo from '@/layout/components/UserLoginInfo.vue'

interface AdsenseData {
  src: string
  url: string
}

const type = ref('my')
const adsenseData = ref<AdsenseData[]>([])
onMounted(() => {
  getAdsenseData(type.value).then((res) => {
    adsenseData.value = res.data
  })
})
const handleAdClick = (url: string) => {
  uni.navigateTo({
    url: `/pages/webview/webview?url=${url}`
  })
}

interface IconList {
  iconName: string
  name: string
  count: number
  toUrl: string
}

const iconList = ref<IconList[]>([
  {
    iconName: '\ue62e',
    name: '黑名单',
    count: 0,
    toUrl: ''
  },
  {
    iconName: '\ue6f8',
    name: '意见反馈',
    count: 0,
    toUrl: ''
  },
  {
    iconName: '\ue608',
    name: '设置',
    count: 0,
    toUrl: 'user-setting'
  },
  {
    iconName: '\ueb97',
    name: '隐私设置',
    count: 0,
    toUrl: ''
  },
  {
    iconName: '\ue6f9',
    name: '神评鉴定',
    count: 0,
    toUrl: ''
  }
])
</script>
<script lang="ts">
export default {
  name: 'MyDetailPage'
}
</script>
<style scoped>
.swiper-item {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}
</style>
